<template>
    <div class="medical-records-list-container">
        <global-search @submitSearch="submitSearch" class="global-tool-search" :showCoder="true" :showDoctor="true" :showLast="false">
            <template slot="other-form">
                <el-form-item label="缺陷类型" v-if="!errReason">
                    <el-select class="defectSate-input" size="small" v-model="searchForm.defectSate" placeholder="">
                        <el-option-group label="">
                            <el-option :value="0" label="全部"></el-option>
                            <el-option :value="8" label="有主要诊断缺陷"></el-option>
                            <el-option :value="10" label="有主要手术操作缺陷"></el-option>
                        </el-option-group>
                        <el-option-group label="">
                            <el-option :value="7" label="有诊断编码缺陷"></el-option>
                            <el-option :value="9" label="有手术操作编码缺陷"></el-option>
                            <el-option :value="11" label="有门(急)诊诊断编码缺陷"></el-option>
                            <el-option :value="12" label="有损伤中毒外因编码缺陷"></el-option>
                            <el-option :value="13" label="有病理诊断编码缺陷"></el-option>
                        </el-option-group>
                        <el-option-group label="">
                            <el-option :value="5" label="有编码缺陷"></el-option>
                            <el-option :value="6" label="有非编码缺陷"></el-option>
                        </el-option-group>
                        <el-option-group label="">
                            <el-option :value="4" label="有缺陷"></el-option>
                            <el-option :value="3" label="无缺陷"></el-option>
                        </el-option-group>
                        <el-option-group label="">
                            <el-option :value="1" label="有扣分"></el-option>
                            <el-option :value="2" label="无扣分"></el-option>
                        </el-option-group>
                    </el-select>
                </el-form-item>
                <el-form-item label="检索">
                    <el-input v-model="searchForm.keyword" class="keyword-input" size="small"
                              placeholder="请输入病案号/患者姓名"></el-input>
                </el-form-item>
            </template>
        </global-search>
        <div class="table-box">
            <div class="head">
                <h3>我的审核(末次)</h3>
                <div class="btn-box">
                    <el-button type="primary" icon="el-icon-upload2" size="small" v-if="activeName !== 'notAudit'"
                               @click="toExportList">导出数据
                    </el-button>
                </div>
            </div>
            <el-tabs class="audit-tabs" v-model="activeName" @tab-click="switchTables">
                <el-tab-pane label="未审核" name="notAudit"></el-tab-pane>
                <el-tab-pane label="审核通过" name="passed"></el-tab-pane>
                <el-tab-pane label="驳回列表" name="reject"></el-tab-pane>
            </el-tabs>
            <el-table
                ref="tableData"
                :data="tableData"
                row-key="id"
                tooltip-effect="light"
                border
                :max-height="tableHeight"
                class="data-table"
                @sort-change="sortChange"
                @selection-change="handleSelectionChange">
                <el-table-column
                    type="selection"
                    :reserve-selection="true"
                    align="center"
                    width="30">
                </el-table-column>
                <el-table-column
                    label="序号"
                    type="index"
                    align="center"
                    width="40">
                </el-table-column>
                <el-table-column
                    prop="medicalRecordSign"
                    label="病案号"
                    align="center"
                    min-width="90"
                    show-overflow-tooltip>
                    <template slot-scope="scope">
                        <span class="to-child-page" :class="viewInfoMonth(scope.row.dischargeDate) ? '' : 'disabled'"
                              @click="toInfo(scope.row, scope.$index)">{{scope.row.medicalRecordSign}}</span>
                    </template>
                </el-table-column>
                <el-table-column
                    prop="hospitalTime"
                    label="住院次数"
                    align="center"
                    min-width="80"
                    sortable="custom"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                    prop="patientName"
                    label="患者姓名"
                    align="center"
                    min-width="65"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                    prop="departmentName"
                    label="出院科室"
                    min-width="110"
                    sortable="custom"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                    prop="dischargeDate"
                    label="出院日期"
                    align="center"
                    min-width="85"
                    sortable="custom"
                    show-overflow-tooltip>
                    <template slot-scope="scope">
                        {{scope.row.dischargeDate.substring(0, 10)}}
                    </template>
                </el-table-column>
                <el-table-column
                    prop="resident"
                    label="住院医师"
                    align="center"
                    min-width="80"
                    sortable="custom"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                    prop="coder"
                    label="编码员"
                    align="center"
                    min-width="80"
                    sortable="custom"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                    prop="diagnosis"
                    label="主要诊断"
                    align="center"
                    min-width="140"
                    sortable="custom"
                    show-overflow-tooltip>
                    <template slot-scope="scope">
                        {{scope.row.diagnosis}}<br>
                        {{scope.row.diagnosisCode}}
                    </template>
                </el-table-column>
                <el-table-column
                    prop="surgery"
                    label="主要手术"
                    align="center"
                    min-width="140"
                    sortable="custom"
                    show-overflow-tooltip>
                    <template slot-scope="scope">
                        {{scope.row.surgery}}<br>
                        {{scope.row.surgeryCode}}
                    </template>
                </el-table-column>
                <el-table-column
                    prop="status"
                    label="审核状态"
                    min-width="80"
                    align="center"
                    sortable="custom"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                    prop="remark"
                    label="驳回原因"
                    min-width="150"
                    align="left"
                    sortable="custom"
                    v-if="activeName === 'reject'"
                    show-overflow-tooltip>
                    <template slot-scope="scope">
                        <p class="remark-p">{{scope.row.remark}}</p>
                        <div v-if="scope.row.pictures.length" class="remarkList">
                            <img :src="item" v-for="(item, index) in scope.row.pictures" alt="" @click="showImg(scope.row.pictures, index)">
                        </div>
                    </template>
                </el-table-column>
                <el-table-column
                    prop="cUser"
                    label="审核人"
                    min-width="80"
                    align="center"
                    sortable="custom"
                    v-if="activeName !== 'notAudit'"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                    prop="cTime"
                    label="审核时间"
                    min-width="140"
                    align="center"
                    sortable="custom"
                    v-if="activeName !== 'notAudit'"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                    label="操作"
                    width="90"
                    align="center"
                    show-overflow-tooltip>
                    <template slot-scope="scope">
                        <!--<el-button type="text" size="small" v-if="activeName === 'notAudit'" v-auth="{code: 100003000001}" @click="showDialogMRAudit(scope.row)">审核</el-button>-->
                        <el-button type="text" size="small" @click="toInfo(scope.row, scope.$index)">查看</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <pagination v-show="tableData.length > 0" :total="total" :page.sync="currentPage" :limit.sync="pageSize"
                        @pagination="changePage"/>
            <el-dialog title="病案首页审核"
                       :close-on-click-modal="false"
                       :visible.sync="isShowMRAudit"
                       @close="closeDialogMRAudit"
                       center
                       width="800px">
                <el-form :model="MRAuditForm" :rules="auditRules" ref="auditMRForm" class="audit-ruleForm">
                    <el-form-item prop="examineState" label="是否通过：">
                        <el-radio-group v-model="MRAuditForm.examineState">
                            <el-radio :label="1">审核通过</el-radio>
                            <el-radio :label="2">驳回</el-radio>
                        </el-radio-group>
                    </el-form-item>
                    <el-form-item label="驳 回 至：" v-if="MRAuditForm.examineState === 2">
                        <div>住院医师</div>
                    </el-form-item>
                    <el-form-item prop="remark" label="驳回原因：" v-if="MRAuditForm.examineState === 2">
                        <el-input v-model="MRAuditForm.remark" size="small" placeholder="请输入驳回原因" type="textarea" :rows="3"></el-input>
                    </el-form-item>
                    <el-form-item label="上传图片：" style="margin-top: 20px" v-if="MRAuditForm.examineState === 2">
                        <el-upload
                            class="upload-img"
                            :class="imgList.length < 3 ? '' : 'none'"
                            ref="upload"
                            action=""
                            list-type="picture-card"
                            :file-list="imgList"
                            :limit="3"
                            :auto-upload="false"
                            :on-preview="handlePictureCardPreview"
                            :before-upload="beforeUpload"
                            :on-change="handleChange"
                            :on-remove="handleRemove">
                            <i class="el-icon-plus"></i>
                        </el-upload>
                    </el-form-item>
                    <el-dialog :visible.sync="dialogImgVisible" :modal="false">
                        <img width="100%" :src="dialogImageUrl" alt="">
                    </el-dialog>
                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button size="small" @click="closeDialogMRAudit">取 消</el-button>
                    <el-button size="small" @click="submitMRAudit" type="primary">确 定</el-button>
                    <div class="tips">
                        <p><i class="el-icon-info"></i>提示</p>
                        <p><span></span>“被驳回”表示该病案存在严重填写缺陷，须编辑修正；</p>
                        <p><span></span>经编辑保存后病案状态更新为“未审核”，可再次进入审核流程；</p>
                        <p><span></span>“审核通过”后，该病案将不可被编辑修改，不可被再次导入系统；</p>
                        <p><span></span>每次至多上传图片3张。</p>
                    </div>
                </div>
            </el-dialog>
            <el-dialog :visible.sync="isShowImg"
                       custom-class="showImgOutBox"
                       @close="closeDialogImg"
                       center
                       width="80%">
                <el-carousel :autoplay="false" arrow="always">
                    <el-carousel-item v-for="item in showImgList" :key="item" class="show-img-box">
                        <img :src="item" alt="" class="show-img">
                    </el-carousel-item>
                </el-carousel>
            </el-dialog>
        </div>
    </div>
</template>

<script>
    import {getMyMRAuditList, exportList} from '@/api/myMR/audit'
    import {checkOverviewTop} from '@/api/medical-records/info-head'
    import {getSortString, dateNumFormat, viewInfoMonth} from '@/utils/filters'
    import Pagination from '@/components/Pagination'
    import BtnGroup from '@/components/BtnGroup'
    import FileSaver from 'file-saver'
    import ExcelJS from 'exceljs'

    export default {
        name: 'Dashboard',
        data () {
            return {
                // 搜索条件
                searchForm: {
                    keyword: '',
                    defectSate: 0
                },
                activeName: 'notAudit',
                // 显示按钮
                showBtn: ['goBack'],
                // 列表数据
                tableData: [],
                // 排序字段
                sortMap: {},
                // 选中的数据
                multipleSelection: [],
                // 上传数量限制
                limit: 5,
                // 数据总数
                total: 0,
                // 当前页
                currentPage: 1,
                // 每页数量
                pageSize: 20,
                // 表格高度
                tableHeight: 107,
                // 路由参数
                queryForm: {},
                // 排序方式
                sortType: '',
                // 全局搜索内容，用于翻页等不传参时使用数据
                globalForm: {},
                // 使用储存的数据，不去请求
                useStore: false,
                // 错误信息
                errReason: '',
                // 显示审核弹框
                isShowMRAudit: false,
                // 审核表单
                MRAuditForm: {
                    examineState: 1,
                    remark: ''
                },
                // 图片列表
                imgList: [],
                // buffer列表
                base64Arr: [],
                // 预览图片路径
                dialogImageUrl: '',
                // 显示预览图片
                dialogImgVisible: false,
                // 正在审核的id
                auditMedicalRecordID: '',
                auditRules: {
                    remark: [
                        {required: true, message: '请输入驳回原因', trigger: ['blur', 'change']},
                        {min: 4, message: '最少输入4个字', trigger: ['blur', 'change']}
                    ]
                },
                // 显示图片查看
                isShowImg: false,
                // 图片查看图片列表
                showImgList: [],
                // 轮播索引
                initialIndex: 0,
                // 导出的全部数据
                allexportData: []
            }
        },
        created () {
            // tags判断入口是否从选项卡进入
            this.useStore = this.$route.query.tags === 'tags'
            let height = document.documentElement.clientHeight - 213 - 10 - 78 - 5 - 32 - 40
            this.tableHeight = height > 107 ? height : 107
            this.initPage()
        },
        mounted () {
            window.onresize = () => {
                // 213=其他元素高度60+50+48+55 10=距离底部边距 78=分页组件高度 5=适应性调整
                let height = document.documentElement.clientHeight - 213 - 10 - 78 - 5 - 32 - 40
                this.tableHeight = height > 107 ? height : 107
            }
        },
        methods: {
            viewInfoMonth,
            /**
             * 初始化页面参数
             */
            initPage () {
                let query = JSON.parse(JSON.stringify(this.$store.state.search.searchForm[this.$route.name]))
                if (query) {
                    if (query.tab) {
                        this.activeName = query.tab
                    } else {
                        this.activeName = 'notAudit'
                        this.setGetStore(this.$route.name, {tab: this.activeName})
                    }
                    this.currentPage = query.pageIndex || 1
                    this.pageSize = query.pageSize || 20
                    this.searchForm.defectSate = query.defectSate || 0
                    this.searchForm.keyword = query.keyword
                    this.errReason = query.errReason
                    this.sortType = query.orderBy
                }
            },
            /**
             * 提交查询
             * @param form 筛选条件
             */
            submitSearch (form) {
                let query = JSON.parse(JSON.stringify(this.$store.state.search.searchForm[this.$route.name]))
                let data = form || this.globalForm
                this.globalForm = data
                let params = {
                    pageSize: this.pageSize,
                    pageIndex: this.currentPage,
                    orderBy: this.sortType,
                    start: data.start,
                    end: data.end,
                    orgId: data.orgId,
                    department: data.department,
                    departmentName: data.departmentName,
                    coder: data.coder,
                    isLast: data.isLast,
                    medicalRecordID: query.medicalRecordID,
                    defectSate: this.searchForm.defectSate,
                    checkState: null,
                    keyword: this.searchForm.keyword,
                    packageID: query.packageID,
                    resident: query.resident
                }
                switch (this.activeName) {
                case 'notAudit':
                    params.checkState = 0
                    break
                case 'passed':
                    params.checkState = 1
                    break
                case 'reject':
                    params.checkState = 2
                    break
                }
                this.setGetStore(this.$route.name, params)
                if (!params.orderBy) params.orderBy = '`DischargeDate` desc'
                if (this.getSession(this.$route.name, 'getMyMRAuditList') && this.useStore) {
                    this.useStore = false
                    let res = this.getSession(this.$route.name, 'getMyMRAuditList')
                    if (res.code.toString() === '200') {
                        this.tableData = res.data.rows
                        this.sortMap = res.data.maps
                        this.total = res.data.total
                    }
                } else {
                    getMyMRAuditList(params).then(res => {
                        this.useStore = false
                        this.setSession(this.$route.name, {getOverviewList: res})
                        if (res.code.toString() === '200') {
                            this.tableData = res.data.rows
                            this.sortMap = res.data.maps
                            this.total = res.data.total
                        } else {
                            this.$message.error(res.message)
                        }
                    })
                }
            },
            /**
             * 打开审核弹框
             * @param row 行数据
             */
            showDialogMRAudit (row) {
                this.isShowMRAudit = true
                this.MRAuditForm.examineState = 1
                this.MRAuditForm.remark = ''
                this.auditMedicalRecordID = row.medicalRecordID
            },
            /**
             * 关闭审核弹框
             */
            closeDialogMRAudit () {
                this.imgList = []
                this.base64Arr = []
                if (this.$refs.upload) {
                    this.$refs.upload.clearFiles()
                }
                this.$refs['auditMRForm'].resetFields()
                this.auditMedicalRecordID = ''
                this.isShowMRAudit = false
            },
            /**
             * 预览图片
             * @param file 文件对象
             */
            handlePictureCardPreview (file) {
                this.dialogImageUrl = file.url
                this.dialogImgVisible = true
            },
            /**
             * 移除图片
             */
            handleRemove (file, fileList) {
                this.imgList = fileList
            },
            /**
             * 文件上传成功
             */
            handleChange (file) {
                if (file.status === 'ready') {
                    this.imgList.push(file)
                    this.getBase64(file.raw).then(res => {
                        this.base64Arr.push(res)
                    })
                }
            },
            /**
             * 图片转base64
             * @param file 文件对象
             */
            getBase64 (file) {
                return new Promise(function (resolve, reject) {
                    let reader = new FileReader()
                    let imgResult = ''
                    reader.readAsDataURL(file)
                    reader.onload = function () {
                        imgResult = reader.result
                    }
                    reader.onerror = function (error) {
                        reject(error)
                    }
                    reader.onloadend = function () {
                        resolve(imgResult)
                    }
                })
            },
            /**
             * 图片转换
             * @param file 文件对象
             */
            imageProcessing (file) {
                let _this = this
                return new Promise(function (resolve) {
                    let reader = new FileReader()
                    reader.readAsArrayBuffer(file)
                    reader.onload = function () {
                        resolve(_this.buf2hex(reader.result))
                    }
                })
            },
            /**
             * buffer数组转byte
             * @param buffer buffer数组
             */
            buf2hex (buffer) {
                return Array.prototype.map.call(new Uint8Array(buffer), x => ('00' + x.toString(16)).slice(-2)).join('')
            },
            /**
             * 图片上传前
             */
            beforeUpload (file) {
                let isLt10M = file.size / 1024 / 1024 < 10
                if (!isLt10M) {
                    this.$message.error('图片大小不能超过 10MB!')
                }
                return isLt10M
            },
            /**
             * 提交审核
             */
            submitMRAudit () {
                this.$refs['auditMRForm'].validate((valid) => {
                    if (valid) {
                        let params = JSON.parse(JSON.stringify(this.$store.state.search.searchForm[this.$route.name]))
                        params.medicalRecordID = this.auditMedicalRecordID
                        params.examineInfo = this.MRAuditForm
                        params.examineInfo.picture = this.base64Arr
                        checkOverviewTop(params).then(res => {
                            this.closeDialogMRAudit()
                            if (res.code.toString() === '200') {
                                this.submitSearch()
                            } else {
                                this.$message.error(res.message)
                            }
                        })
                    } else {
                        return false
                    }
                })
            },
            /**
             * 关闭图片预览
             */
            closeDialogImg () {
                this.isShowImg = false
                this.showImgList = []
                this.initialIndex = 0
            },
            /**
             * 打开图片预览
             * @param list 图片列表
             * @param idx 轮播初始索引
             */
            showImg (list, idx) {
                this.showImgList = list
                this.isShowImg = true
                this.initialIndex = idx
            },
            /**
             * 选中事件
             */
            handleSelectionChange (val) {
                this.multipleSelection = val
            },
            /**
             * 切换标签页
             */
            switchTables (tab) {
                this.tableData = []
                this.setGetStore(this.$route.name, {tab: tab.name})
                this.multipleSelection = []
                this.sortType = ''
                this.tableData = []
                this.currentPage = 1
                this.submitSearch()
            },
            /**
             * 导出列表
             */
            toExportList () {
                let params = JSON.parse(JSON.stringify(this.$store.state.search.searchForm[this.$route.name]))
                if (!params.orderBy) params.orderBy = '`DischargeDate` desc'
                if (this.getSelectId()) {
                    params.excelId = this.getSelectId()
                } else {
                    params.excelId = []
                }
                this.$store.dispatch('UpdateLoadingText', '0%')
                this.$store.dispatch('UpdateIsExport', true)
                this.$store.dispatch('UpdateLoading', true)
                params.pageIndex = 1
                params.pageSize = 1000
                this.allexportData = []
                this.sendRequest(params)
            },
            /**
             * 发送请求
             * @param params 请求参数
             */
            sendRequest (params) {
                let allIndex = Math.ceil(this.total / 1000)
                exportList(params).then(res => {
                    if (res.code.toString() === '200') {
                        this.$store.dispatch('UpdateLoadingText', parseInt(params.pageIndex / allIndex * 95) + '%')
                        this.allexportData = this.allexportData.concat(res.data.rows)
                        if (params.pageIndex < allIndex) {
                            this.sendRequest({...params, pageIndex: params.pageIndex + 1})
                        } else {
                            this.exportDataList('病案首页列表', this.allexportData)
                        }
                    } else {
                        this.$store.dispatch('UpdateIsExport', false)
                        this.$store.dispatch('UpdateLoading', false)
                        this.$message.error('导出失败')
                    }
                }).catch(() => {
                    this.$store.dispatch('UpdateIsExport', false)
                    this.$store.dispatch('UpdateLoading', false)
                    this.$message.error('导出失败')
                })
            },
            /**
             * 导出excel表头
             */
            getHeader () {
                let arr = [{
                    header: '序号', key: 'index', width: 10
                }, {
                    header: '病案号', key: 'medicalRecordSign', width: 12
                }, {
                    header: '住院次数', key: 'hospitalTime', width: 10
                }, {
                    header: '患者姓名', key: 'patientName', width: 10
                }, {
                    header: '出院科室', key: 'departmentName', width: 16
                }, {
                    header: '出院日期', key: 'dischargeDate', width: 12
                }, {
                    header: '住院医师', key: 'resident', width: 10
                }, {
                    header: '编码员', key: 'coder', width: 10
                }, {
                    header: '主要诊断', key: 'diagnosis', width: 32
                }, {
                    header: '主要手术', key: 'surgery', width: 32
                }, {
                    header: '审核状态', key: 'status', width: 16
                }]
                if (this.activeName === 'reject') {
                    arr.push({
                        header: '驳回原因', key: 'remark', width: 32
                    })
                }
                if (this.activeName !== 'notAudit') {
                    arr.push({
                        header: '审核人', key: 'cUser', width: 10
                    }, {
                        header: '审核时间', key: 'cTime', width: 16
                    })
                }
                return arr
            },
            /**
             * 导出列表excel
             */
            exportDataList (name, data) {
                let workbook = new ExcelJS.Workbook()
                workbook.creator = 'lyliang'
                workbook.views = [{
                    x: 0,
                    y: 0,
                    firstSheet: 0,
                    activeTab: 1,
                    visibility: 'visible'
                }]
                let worksheet = workbook.addWorksheet('Sheet1')
                worksheet.columns = this.getHeader()
                for (let i = 0; i < data.length; i++) {
                    data[i].index = i + 1
                    data[i].dischargeDate = data[i].dischargeDate.substring(0, 10)
                    data[i].diagnosis = `${data[i].diagnosis}\r\n${data[i].diagnosisCode}`
                    data[i].surgery = `${data[i].surgery}\r\n${data[i].surgeryCode}`
                    worksheet.addRow(data[i])
                    worksheet.getRow(i + 1).alignment = {wrapText: true, vertical: 'middle', horizontal: 'center'}
                    let rate = parseInt((i + 1) / data.length * 0.03 * 100 + 95) + '%'
                    this.$store.dispatch('UpdateLoadingText', rate)
                }
                worksheet.getRow(data.length + 1).alignment = {wrapText: true, vertical: 'middle', horizontal: 'center'}
                workbook.xlsx.writeBuffer().then(data => {
                    this.$store.dispatch('UpdateLoadingText', '99%')
                    let blob = new Blob([data], {type: 'EXCEL_TYPE'})
                    FileSaver.saveAs(blob, `${this.parseTime(new Date().getTime())} ${name}.xlsx`)
                    this.$store.dispatch('UpdateLoadingText', '100%')
                    this.$store.dispatch('UpdateIsExport', false)
                    this.$store.dispatch('UpdateLoading', false)
                })
            },
            /**
             * 获取选中id
             */
            getSelectId () {
                let arr = []
                if (this.multipleSelection.length) {
                    this.multipleSelection.forEach(item => {
                        arr.push(item.medicalRecordID)
                    })
                    return arr
                } else {
                    return false
                }
            },
            /**
             * 翻页
             */
            changePage () {
                this.submitSearch()
            },
            /**
             * 排序修改
             * @param colData.prop 排序参数
             * @param colData.order 正序倒序 ascending 升序 descending 降序 null 不排序默认
             */
            sortChange (colData) {
                let data = colData
                data.prop = colData.prop === 'cUser' ? 'cUserId' : colData.prop
                this.sortType = getSortString(data, this.sortMap)
                this.tableData = []
                this.currentPage = 1
                this.submitSearch()
            },
            /**
             * 前往病案详情
             * @param row 行数据
             * @param index 索引
             */
            toInfo (row, index) {
                let data = JSON.parse(JSON.stringify(this.$store.state.search.searchForm[this.$route.name]))
                if (viewInfoMonth(row.dischargeDate)) {
                    let params = {
                        ...data,
                        pageIndex: (this.currentPage - 1) * this.pageSize + index + 1,
                        pageSize: 1,
                        isLast: true
                    }
                    this.$store.dispatch('search/coverSearchFormItem', {
                        pageName: 'MyMRAuditInfo',
                        query: params
                    })
                    this.$router.push({name: 'MyMRAuditInfo'})
                }
            }
        },
        components: {
            BtnGroup,
            Pagination
        },
        filters: {
            getStatus (val) {
                switch (val) {
                case 0:
                    return '未审核'
                case 1:
                    return '已审核'
                case 2:
                    return '驳回'
                }
            },
            dateNumFormat
        },
        beforeDestroy () {
            window.onresize = null
        }
    }
</script>

<style lang="scss" scoped>
    .medical-records-list-container {
        /deep/ .el-form-item {
            margin-bottom: 0;

        }
        .status-input {
            width: 90px;
        }
        .defectSate-input {
            width: 120px;
            /deep/ .el-input__inner {
                padding: 0 10px 0 5px;
            }
        }
        .keyword-input {
            width: 150px;
            /deep/ .el-input__inner {
                padding: 0 5px 0 5px;
            }
        }
        .table-box {
            height: calc(100vh - 215px + 30px);
            background: #fff;
            padding: 0 10px;
            .head {
                height: 48px;
                display: flex;
                justify-content: space-between;
                align-items: center;
                h3 {
                    font-size: 16px;
                    color: #000;
                    font-weight: 600;
                    line-height: 48px;
                    span {
                        font-size: 12px;
                        color: #7e7e7e;
                        font-weight: normal;
                        margin-left: 20px;
                    }
                }
                .btn-box {
                    display: flex;
                    justify-content: flex-end;
                    align-items: center;
                }
            }
            .audit-tabs {
                /deep/.el-tabs__header {
                    margin-bottom: 0;
                }
            }
            .data-table {
                width: 100%;
            }
            .remark-p {
                margin: 0;
                width: 100%;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .remarkList {
                display: flex;
                justify-content: flex-start;
                align-items: center;
                img {
                    display: block;
                    width: 36px;
                    height: 48px;
                    margin-right: 4px;
                }
            }
        }
    }
    .dialog-footer {
        text-align: center;
        .tips {
            margin-top: 20px;
            text-align: left;
            padding: 10px 20px;
            border: 1px solid #D7D7D7;
            background: #F2F2F2;
            border-radius: 8px;
            p {
                color: #333;
                font-size: 14px;
                line-height: 24px;
                position: relative;
                padding-left: 20px;
                margin: 0;
                .el-icon-info {
                    color: #108EE9;
                    margin-right: 6px;
                }
                &:first-child {
                    padding-left: 0;
                }
                span {
                    position: absolute;
                    top: 9px;
                    left: 8px;
                    display: block;
                    width: 6px;
                    height: 6px;
                    border-radius: 50%;
                    background: #333;
                }
            }
        }
    }
    /deep/.el-dialog__body {
        padding: 15px 25px 20px;
    }
    .el-form-item {
        margin: 0 20px 10px;
    }
    /deep/.el-form-item.is-required .el-form-item__label {
        margin-left: -10px;
    }
    .el-textarea {
        width: 80%;
    }
    /deep/.el-form-item__error {
        left: 82px;
    }
</style>
<style lang="scss">
    .showImgOutBox {
        margin-top: 10vh!important;
        height: 80vh;
        .el-carousel__container {
            height: calc(80vh - 65px);
        }
        .show-img-box {
            width: 100%;
            .show-img {
                display: block;
                margin: 0 auto;
                width: 100%;
                height: 100%;
                object-fit: scale-down;
            }
        }
    }
</style>
